
const path = require('path')
var webpackMerge = require('webpack-merge');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var SkeletonPlugin = require('page-skeleton-webpack-plugin').SkeletonPlugin
var commonConfig = require('./webpack.common.js');
var CopyWebpackPlugin = require('copy-webpack-plugin');
var ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');

var utils = require('./utils');
var ENV ='DEV';

var outDir = 'dist';
var output = webpackMerge.smartStrategy({
    entry: 'prepend',
    'plugins': 'prepend',
    'module.loaders': 'prepend'
})(commonConfig({ env: ENV }), {
    devtool: 'cheap-module-source-map',
    mode: 'development',
    performance: {
        maxEntrypointSize: 512000,
        maxAssetSize: 512000
    },
    devServer: {
        historyApiFallback: true,
        stats: 'minimal'
    },
    output: {
        path: utils.root(outDir),
        publicPath: '', // relative path  <>
        filename: 'js/[name].bundle.js',
        chunkFilename: 'js/[id].chunk.bundle.js',
    },


    plugins: [
        new ForkTsCheckerWebpackPlugin(),
        new CopyWebpackPlugin([{
            from: './src/config/app.dev.config.js',
            to: 'app.config.js',
            force: true
        }]),

        new HtmlWebpackPlugin({
            title: 'Firm_ext',
            template: './src/index.html',
            filename: 'index.html',
            excludeAssets: [/style.*\.js/, /boot.*\.js/],
        }),

        // new SkeletonPlugin({
        //     pathname: utils.root('shell'), // 用来存储 shell 文件的地址
        //     staticDir: utils.root(outDir), // 最好和 `output.path` 相同
        //     routes: ['/','/home','/search'], // 将需要生成骨架屏的路由添加到数组中,
        //     // port:'9097'
        //   }),
        new SkeletonPlugin({
            pathname:  utils.root('shell'),
            staticDir:  utils.root(outDir),
            routes: ['/'],
            port: '9098',
            loading: 'chiaroscuro',
            svg: {
              color: '#EFEFEF',
              shape: 'circle',
              shapeOpposite: ['.Rating-gray_1kpffd5_0 svg']
            },
            image: {
              shape: 'rect', // `rect` | `circle`
              color: '#EFEFEF',
              shapeOpposite: ['.mint-swipe-items-wrap img']
            },
            pseudo: {
              color: '#EFEFEF', // or transparent
              shape: 'circle', // circle | rect
              shapeOpposite: ['.delivery-icon-hollow_3q8_B5r_0', '.index-premium_39rl0v9']
            },
            button: {
              color: '#EFEFEF',
              excludes: ['.mint-swipe-items-wrap a']
            },
            defer: 5000,
            excludes: [],
            remove: [],
            hide: ['.index-dashedline_7B79b3W', '.Rating-actived_GBtiHkB_0'],
            grayBlock: ['#header'],
            cssUnit: 'rem',
            headless: true,
            // minify: false,
            cookies: [{
              name: 'SID',
              value: 'a495vvmEPEE4DZi083dr8yR3EAPYqW40HaWA',
              url: 'https://h5.ele.me'
            }, {
              name: 'USERID',
              value: '273745271',
              url: 'https://h5.ele.me'
            }],
            noInfo: false
          }),
    ]
});

module.exports = output;